import 'dart:math';

import 'package:bruno/bruno.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:getwidget/getwidget.dart';
import 'package:meal/constant/sizes.dart';
import 'package:meal/event/event_model.dart';
import 'package:meal/route/route.dart';
import 'package:meal/ui/check_code.dart';
import 'package:meal/utils/colors.dart';
import 'package:meal/utils/sp.dart';
import 'package:meal/utils/styles.dart';

class Login extends StatefulWidget {
  const Login({Key? key}) : super(key: key);

  @override
  State<Login> createState() => _LoginState();
}

class _LoginState extends State<Login> {
  String code = '';

  bool isChecked = true;

  @override
  void initState() {
    createdCode();
    super.initState();
    globalBus.on<LoginBackEvent>().listen((LoginBackEvent event) {
      if (GetPlatform.isAndroid || GetPlatform.isIOS) {
        SystemChrome.setSystemUIOverlayStyle(const SystemUiOverlayStyle(
          statusBarIconBrightness: Brightness.dark,
          statusBarColor: Colors.transparent,
        ));
      }
      // setState(() {
      //
      // });
    });
  }

  void createdCode() {
    code = '';
    for (var i = 0; i < 5; i++) {
      code = code + Random().nextInt(9).toString();
    }
  }

  @override
  Widget build(BuildContext context) {
    return createdSemantics(context);
  }

  Widget createdSemantics(BuildContext context) {
    return Semantics(
      container: true,
      child: AnnotatedRegion<SystemUiOverlayStyle>(
        value: const SystemUiOverlayStyle(
          statusBarIconBrightness: Brightness.dark,
          statusBarColor: Colors.transparent,
        ),
        child: Material(
          child: Semantics(
            explicitChildNodes: true,
            child: Container(
              padding: EdgeInsets.only(
                  top: Get.mediaQuery.padding.top + Sizes.default50,
                  left: Sizes.default20,
                  right: Sizes.default20),
              decoration: const BoxDecoration(
                color: Colors.white,
              ),
              child: Column(
                children: [
                  Expanded(
                      child: Column(
                    children: [
                      Container(
                        margin: const EdgeInsets.only(top: Sizes.default20),
                        alignment: Alignment.centerLeft,
                        child: Text('验证码登录',
                            style: StylesUtils.customTextStyle(
                                color: ColorsUtils.color363, fontSize: Sizes.default30)),
                      ),
                      Container(
                        margin: const EdgeInsets.only(top: Sizes.default20),
                        alignment: Alignment.centerLeft,
                        child: Row(
                          children: [
                            Container(
                              width: 60,
                              alignment: Alignment.centerLeft,
                              child: Text('手机号',
                                  style: StylesUtils.customTextStyle(
                                      fontSize: Sizes.default15, color: ColorsUtils.color363)),
                            ),
                            Expanded(
                                child: Row(
                              children: [
                                Text.rich(TextSpan(
                                    text: '+86',
                                    style: StylesUtils.customTextStyle(
                                        fontSize: Sizes.default16, color: ColorsUtils.color363))),
                                Expanded(
                                    child: Container(
                                  margin: const EdgeInsets.only(left: Sizes.default10),
                                  child: TextField(
                                    style: StylesUtils.customTextStyle(
                                        color: ColorsUtils.color363, fontSize: Sizes.default16),
                                    decoration: InputDecoration(
                                        border: const OutlineInputBorder(
                                          borderSide: BorderSide.none,
                                        ),
                                        isCollapsed: true,
                                        filled: true,
                                        fillColor: ColorsUtils.rgba(255, 255, 255),
                                        contentPadding: const EdgeInsets.symmetric(
                                            horizontal: Sizes.default10, vertical: Sizes.default10),
                                        constraints: const BoxConstraints(minHeight: 40),
                                        hintText: '请输入手机号',
                                        hintStyle: StylesUtils.customTextStyle(
                                            fontSize: Sizes.default15,
                                            color: ColorsUtils.colorCcc)),
                                    keyboardType: TextInputType.phone,
                                    onChanged: (String content) {},
                                  ),
                                ))
                              ],
                            ))
                          ],
                        ),
                      ),
                      Container(
                        margin: const EdgeInsets.only(top: Sizes.default20),
                        alignment: Alignment.centerLeft,
                        child: Row(
                          children: [
                            Container(
                              width: 60,
                              alignment: Alignment.centerLeft,
                              child: Text('校验码',
                                  style: StylesUtils.customTextStyle(
                                      fontSize: Sizes.default15, color: ColorsUtils.color363)),
                            ),
                            Expanded(
                                child: Row(
                              children: [
                                Expanded(
                                    child: Container(
                                  margin: const EdgeInsets.only(left: Sizes.default10),
                                  child: TextField(
                                    style: StylesUtils.customTextStyle(
                                        color: ColorsUtils.color363, fontSize: Sizes.default16),
                                    decoration: InputDecoration(
                                        border: const OutlineInputBorder(
                                          borderSide: BorderSide.none,
                                        ),
                                        isCollapsed: true,
                                        filled: true,
                                        fillColor: ColorsUtils.rgba(255, 255, 255),
                                        contentPadding: const EdgeInsets.symmetric(
                                            horizontal: Sizes.default10, vertical: Sizes.default10),
                                        constraints: const BoxConstraints(minHeight: 40),
                                        hintText: '请输入校验码',
                                        hintStyle: StylesUtils.customTextStyle(
                                            fontSize: Sizes.default15,
                                            color: ColorsUtils.colorCcc)),
                                    keyboardType: TextInputType.number,
                                    onChanged: (String content) {},
                                  ),
                                )),
                                Container(
                                    width: Sizes.default120,
                                    alignment: Alignment.center,
                                    child: InkWell(
                                      onTap: () {
                                        createdCode();
                                        setState(() {});
                                      },
                                      child: CheckCode(
                                        code: code,
                                        dotCount: 10,
                                      ),
                                    ))
                              ],
                            ))
                          ],
                        ),
                      ),
                      Container(
                        margin: const EdgeInsets.only(top: Sizes.default20),
                        alignment: Alignment.centerLeft,
                        child: Wrap(
                          spacing: Sizes.default5,
                          crossAxisAlignment: WrapCrossAlignment.center,
                          children: [
                            BrnCheckbox(
                              radioIndex: 1,
                              onValueChangedAtIndex: (int index, bool value) {
                                isChecked = value;
                                setState(() {});
                              },
                              isSelected: isChecked,
                              childOnRight: true,
                              mainAxisSize: MainAxisSize.min,
                              child: Text(
                                '我已阅读并同意签署',
                                style: StylesUtils.customTextStyle(
                                    fontSize: Sizes.default13, color: ColorsUtils.colorE7e),
                              ),
                            ),
                            InkWell(
                              onTap: () {
                                Get.toNamed(RouteGet.userAboutProtocol);
                              },
                              child: Text('《用户协议》',
                                  style: StylesUtils.customTextStyle(
                                      color: ColorsUtils.colorFf6, fontSize: Sizes.default13)),
                            ),
                            InkWell(
                              onTap: () {
                                Get.toNamed(RouteGet.userAboutPrivacy);
                              },
                              child: Text('《隐私政策》',
                                  style: StylesUtils.customTextStyle(
                                      color: ColorsUtils.colorFf6, fontSize: Sizes.default13)),
                            )
                          ],
                        ),
                      ),
                      Container(
                        width: double.maxFinite,
                        margin: const EdgeInsets.only(top: Sizes.default20),
                        child: GFButton(
                            onPressed: () async {
                              await SpUtils.putBool('is_login', true);
                              Get.until((route) => route.settings.name == RouteGet.home);
                            },
                            text: '获取短信验证码',
                            textStyle: StylesUtils.customTextStyle(fontSize: Sizes.default16),
                            shape: GFButtonShape.pills,
                            type: GFButtonType.solid,
                            size: GFSize.LARGE,
                            color: ColorsUtils.parseColorFromHexString(
                                isChecked ? ColorsUtils.colorFf6 : ColorsUtils.color666)),
                      ),
                      Container(
                        margin: const EdgeInsets.only(top: Sizes.default20),
                        child: InkWell(
                          onTap: () {
                            Get.toNamed(RouteGet.userLoginPwd);
                          },
                          child: Text(
                            '登录密码',
                            style: StylesUtils.customTextStyle(
                                fontSize: Sizes.default16, color: ColorsUtils.colorFf6),
                          ),
                        ),
                      )
                    ],
                  )),
                  Container(
                    padding: const EdgeInsets.only(bottom: Sizes.default50),
                    alignment: Alignment.center,
                    child: InkWell(
                      onTap: () {
                        Get.toNamed(RouteGet.storeOpen);
                      },
                      child: Text('我要开店',
                          style: StylesUtils.customTextStyle(color: ColorsUtils.color797)),
                    ),
                  )
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}
